// plugin/components/button/index.js

const SIZE_CLASS = {
	normal: 'normal',
	small: 'small',
}

const TYPE_CLASS = {
	primary: 'primary',
	secondary: 'secondary',
}

Component({
  options: {
      multipleSlots: true, // 在组件定义时的选项中启用多slot支持
      addGlobalClass: true
  },
  /**
   * 组件的属性列表
   */
  properties: {
  
    className: {
      type: String,
      value: ''
    },
    /** 按钮是否镂空，背景色透明
     * @supported weapp, h5, rn
     * @default false
     */
    plain: {
      type: Boolean,
      value: false
    },

    /** 是否禁用
     * @supported weapp, h5, rn
     * @default false
     */
    disabled: {
      type: Boolean,
      value: false
    },

    /** 名称前是否带 loading 图标
     * @supported weapp, h5, rn
     * @default false
     */
    loading: {
      type: Boolean,
      value: false
    },

    /** 用于 `<form/>` 组件，点击分别会触发 `<form/>` 组件的 submit/reset 事件
     * @supported weapp
     */
    formType: {
      type: String,
      value: ''
    },

    /** 微信开放能力
     * @supported weapp
     */
    openType: {
      type: String,
      value: ''
    },

    /** 指定按下去的样式类。当 `hover-class="none"` 时，没有点击态效果
     * @default button-hover
     * @supported weapp, h5
     * @rn 支持 hoverStyle 属性，但框架未支持 hoverClass
     */
    hoverClass: {
      type: String,
      value: ''
    },

    /** 由于 RN 不支持 Class，故 RN 端的 Button 组件实现了 `hoverStyle`属性，写法和 style 类似，只不过 `hoverStyle` 的样式是指定按下去的样式。
     * @default none
     * @supported rn
     */
    hoverStyle: {
      type: String,
      value: ''
    },

    /** 指定是否阻止本节点的祖先节点出现点击态
     * @default false
     * @supported weapp
     */
    hoverStopPropagation: {
      type: Boolean,
      value: false
    },

    /** 按住后多久出现点击态，单位毫秒
     * @default 20
     * @supported weapp, h5, rn
     */
    hoverStartTime: {
      type: Number,
      value: 20
    },

    /** 手指松开后点击态保留时间，单位毫秒
     * @default 70
     * @supported weapp, h5, rn
     */
    hoverStayTime: {
      type: Number,
      value: 70
    },

    /** 指定返回用户信息的语言，zh_CN 简体中文，zh_TW 繁体中文，en 英文。
     *
     * 生效时机: `open-type="getUserInfo"`
     * @supported weapp
     */
    lang: {
      type: String,
      value: 'zh_CN'
    },
    /** 会话来源
     *
     * 生效时机：`open-type="contact"`
     * @supported weapp
     */
    sessionFrom: {
      type: String,
      value: ''
    },

    /** 会话内消息卡片标题
     *
     * 生效时机：`open-type="contact"`
     * @default 当前标题
     * @supported weapp
     */
    sendMessageTitle: {
      type: String,
      value: ''
    },

    /** 会话内消息卡片点击跳转小程序路径
     *
     * 生效时机：`open-type="contact"`
     * @default 当前标题
     * @supported weapp
     */
    sendMessagePath: {
      type: String,
      value: ''
    },

    /** 会话内消息卡片图片
     *
     * 生效时机：`open-type="contact"`
     * @default 截图
     * @supported weapp
     */
    sendMessageImg: {
      type: String,
      value: ''
    },

    /** 打开 APP 时，向 APP 传递的参数
     *
     * 生效时机：`open-type="launchApp"`
     * @supported weapp
     */
    appParameter: {
      type: String,
      value: ''
    },

    /** 支付宝小程序 scope
     * 
     * 生效时机：`open-type="getAuthorize"`
     * @supported weapp
     */
    scope: {
      type: String,
      value: 'userInfo' | 'phoneNumber'
    },

    /** 显示会话内消息卡片
     *
     * 生效时机：`open-type="contact"`
     * @default false
     */
    showMessageCard: {
      type: Boolean,
      value: false
    },



    /**
     * 按钮的大小
     * @default 'normal'
     */
    size: {
      type: String,
      value: 'normal'
    },
    /**
     * 按钮的类型
     */
    type: {
      type: String,
      value: 'primary' | 'secondary'
    },
    /**
     * 设置按钮圆角
     * @default false
     */
    circle: {
      type: Boolean,
      value: false
    },
    /**
     * 是否通栏样式（即按钮宽度为屏幕宽度时的样式）
     * @default false
     */
    full: {
      type: Boolean,
      value: false
    },
    /**
     * 设置按钮的载入状态
     * @default false
     */
    loading: {
      type: Boolean,
      value: false
    },
    /**
     * 设置按钮为禁用态（不可点击）
     * @default false
     */
    disabled: {
      type: Boolean,
      value: false
    },
  },

  /**
   * 组件的初始数据
   */
  data: {
    sizeClass: SIZE_CLASS,
    typeClass: TYPE_CLASS,
  },

  /**
   * 组件的方法列表
   */
  methods: {
    onClick: function(e) {
      this.triggerEvent('click', e)
    },
    onSumit: function(e) {
      this.triggerEvent('submit', e)
    },
    onReset: function(e) {
      this.triggerEvent('reset', e)
    },
    onGetUserInfo: function(e) {
      this.triggerEvent('getuserinfo', e)
    },
    onGetPhoneNumber: function(e) {
      this.triggerEvent('getphonenumber', e)
    },
    onOpenSetting: function(e) {
      this.triggerEvent('opensetting', e)
    },
    onError: function(e) {
      this.triggerEvent('error', e)
    },
    onContact: function(e) {
      this.triggerEvent('contact', e)
    },
  }
})
